<!--
  * hx-冷却箱
  *
  * @Author:    xuesg
  * @Date:      2025-01-14 16:45:27
  * @Copyright  hx
-->
<template>
  <a-modal
      :title="form.id ? '编辑' : '添加'"
      :width="1000"
      :open="visibleFlag"
      @cancel="onClose"
      :maskClosable="false"
      :destroyOnClose="true"
  >
    <a-form ref="formRef" :model="form" :rules="rules" :label-col="{ span: 5 }">
      <a-form-item label="型号" name="model">
        <a-input style="width: 100%" v-model:value="form.model" placeholder="型号"/>
      </a-form-item>
      <a-form-item label="类型" name="type">
<!--        <SmartEnumSelect enum-name="BOX_TYPE_ENUM" v-model:value="form.type" />-->

        <a-radio-group v-model:value="form.type">
          <a-radio :value="1">单箱</a-radio>
          <a-radio :value="2">组合</a-radio>
        </a-radio-group>
      </a-form-item>
      <a-form-item label="组合" name="model">
        <a-input style="width: 100%" v-model:value="form.combination" placeholder="组合"/>
      </a-form-item>
      <a-form-item label="冷吨量" name="model">
        <a-input style="width: 100%" v-model:value="form.ton" placeholder="冷吨量"/>
      </a-form-item>
      <a-form-item label="冷吨量组合" name="model">
        <a-input style="width: 100%" v-model:value="form.tonCombination" placeholder="冷吨量组合"/>
      </a-form-item>
      <a-form-item label="封面图" name="imageUrl">
        <FileUpload
            list-type="picture-card"
            :maxUploadSize="1"
            :defaultFileList="form.imgList"
            :multiple="true"
            :folder="FILE_FOLDER_TYPE_ENUM.COMMON.value"
            @change="getImg"
          />
      </a-form-item>
      <a-form-item label="轮播图" name="banners">
        <FileUpload
            list-type="picture-card"
            :maxUploadSize="10"
            :defaultFileList="form.bannerList"
            :multiple="true"
            :folder="FILE_FOLDER_TYPE_ENUM.COMMON.value"
            @change="getBanner"
          />
      </a-form-item>
      <a-form-item label="尺寸" name="size">
        <a-input style="width: 100%" v-model:value="form.size" placeholder="尺寸"/>
      </a-form-item>
      <a-form-item label="必站SCOP，单位KW/KW" name="scop">
        <a-input-number style="width: 100%" v-model:value="form.scop" placeholder="必站SCOP，单位KW/KW"/>
      </a-form-item>
      <a-form-item label="总功率，单位KW" name="totalPower">
        <a-input-number style="width: 100%" v-model:value="form.totalPower" placeholder="总功率，单位KW"/>
      </a-form-item>
      <a-form-item label="3d图纸" name="drawings3dUrl">
        <a-input style="width: 100%" v-model:value="form.drawings3dUrl" placeholder="3d图纸"/>
      </a-form-item>
      <a-form-item label="CAD图纸" name="cadUrl">
        <a-input style="width: 100%" v-model:value="form.cadUrl" placeholder="CAD图纸"/>
      </a-form-item>
      <a-form-item label="吊装应力分析" name="stressAnalysisUrl1">
        <a-input style="width: 100%" v-model:value="form.stressAnalysisUrl1" placeholder="吊装应力分析"/>
      </a-form-item>
      <a-form-item label="静应力分析" name="stressAnalysisUrl2">
        <a-input style="width: 100%" v-model:value="form.stressAnalysisUrl2" placeholder="静应力分析"/>
      </a-form-item>
      <a-form-item label="制冷主机:类型" name="chillerType">
        <a-input style="width: 100%" v-model:value="form.chillerType" placeholder="制冷主机:类型"/>
      </a-form-item>
      <a-form-item label="制冷主机:制冷量:KW" name="chillerCoolingCapacityKw">
        <a-input-number style="width: 100%" v-model:value="form.chillerCoolingCapacityKw"
                        placeholder="制冷主机:制冷量:KW"/>
      </a-form-item>
      <a-form-item label="制冷主机:制冷量:RT" name="chillerCoolingCapacityRt">
        <a-input-number style="width: 100%" v-model:value="form.chillerCoolingCapacityRt"
                        placeholder="制冷主机:制冷量:RT"/>
      </a-form-item>
      <a-form-item label="制冷主机:输入功率:KW" name="chillerPower">
        <a-input-number style="width: 100%" v-model:value="form.chillerPower" placeholder="制冷主机:输入功率:KW"/>
      </a-form-item>
      <a-form-item label="冷冻水泵:流量:m³/h" name="chilledWaterPumpFlow">
        <a-input-number style="width: 100%" v-model:value="form.chilledWaterPumpFlow" placeholder="冷冻水泵:流量:m³/h"/>
      </a-form-item>
      <a-form-item label="冷冻水泵:扬程:m" name="chilledWaterPumpHead">
        <a-input-number style="width: 100%" v-model:value="form.chilledWaterPumpHead" placeholder="冷冻水泵:扬程:m"/>
      </a-form-item>
      <a-form-item label="冷冻水泵:功率:KW" name="chilledWaterPumpPower">
        <a-input-number style="width: 100%" v-model:value="form.chilledWaterPumpPower" placeholder="冷冻水泵:功率:KW"/>
      </a-form-item>
      <a-form-item label="冷却水泵:流量:m³/h" name="coolingWaterPumpFlow">
        <a-input-number style="width: 100%" v-model:value="form.coolingWaterPumpFlow" placeholder="冷却水泵:流量:m³/h"/>
      </a-form-item>
      <a-form-item label="冷却水泵:扬程:m" name="coolingWaterPumpHead">
        <a-input-number style="width: 100%" v-model:value="form.coolingWaterPumpHead" placeholder="冷却水泵:扬程:m"/>
      </a-form-item>
      <a-form-item label="冷却水泵:功率:KW" name="coolingWaterPumpPower">
        <a-input-number style="width: 100%" v-model:value="form.coolingWaterPumpPower" placeholder="冷却水泵:功率:KW"/>
      </a-form-item>
      <a-form-item label="冷却塔:类型" name="coolingTowerType">
        <a-input style="width: 100%" v-model:value="form.coolingTowerType" placeholder="冷却塔:类型"/>
      </a-form-item>
      <a-form-item label="冷却塔:流量:m³/h" name="coolingTowerFlow">
        <a-input-number style="width: 100%" v-model:value="form.coolingTowerFlow" placeholder="冷却塔:流量:m³/h"/>
      </a-form-item>
      <a-form-item label="冷却塔:功率:KW" name="coolingTowerPower">
        <a-input-number style="width: 100%" v-model:value="form.coolingTowerPower" placeholder="冷却塔:功率:KW"/>
      </a-form-item>
      <a-form-item label="接管尺寸:进出水接管:DN" name="nozzleSize">
        <a-input-number style="width: 100%" v-model:value="form.nozzleSize" placeholder="接管尺寸:进出水接管:DN"/>
      </a-form-item>
      <a-form-item label="必站外形尺寸:L" name="scopSizeL">
        <a-input-number style="width: 100%" v-model:value="form.scopSizeL" placeholder="必站外形尺寸:L"/>
      </a-form-item>
      <a-form-item label="必站外形尺寸:W" name="scopSizeW">
        <a-input-number style="width: 100%" v-model:value="form.scopSizeW" placeholder="必站外形尺寸:W"/>
      </a-form-item>
      <a-form-item label="必站外形尺寸:H" name="scopSizeH">
        <a-input-number style="width: 100%" v-model:value="form.scopSizeH" placeholder="必站外形尺寸:H"/>
      </a-form-item>
      <a-form-item label="必站重量:吊装重量:KG" name="liftingWeight">
        <a-input-number style="width: 100%" v-model:value="form.liftingWeight" placeholder="必站重量:吊装重量:KG"/>
      </a-form-item>
      <a-form-item label="必站重量:运行重量:KG" name="operatingWeight">
        <a-input-number style="width: 100%" v-model:value="form.operatingWeight" placeholder="必站重量:运行重量:KG"/>
      </a-form-item>
    </a-form>

    <FilePreviewModal ref="filePreviewModalRef" />
    <template #footer>
      <a-space>
        <a-button @click="onClose">取消</a-button>
        <a-button type="primary" @click="onSubmit">保存</a-button>
      </a-space>
    </template>
  </a-modal>
</template>
<script setup>
import {reactive, ref, nextTick} from 'vue';
import {message} from 'ant-design-vue';
import {SmartLoading} from '/@/components/framework/smart-loading';
import { BOX_TYPE_ENUM } from '/@/constants/hx-const';
import _ from 'lodash';
import {boApi} from '/@/api/hx/bo-api';
import {smartSentry} from '/@/lib/smart-sentry';
import SmartEnumSelect from '/@/components/framework/smart-enum-select/index.vue';
import FilePreviewModal from '/@/components/support/file-preview-modal/index.vue';
import FileUpload from '/@/components/support/file-upload/index.vue';
import { FILE_FOLDER_TYPE_ENUM } from '/@/constants/support/file-const';


// ------------------------ 事件 ------------------------

const emits = defineEmits(['reloadList']);

// ------------------------ 显示与隐藏 ------------------------
// 是否显示
const visibleFlag = ref(false);

function show(rowData) {
  Object.assign(form, formDefault);
  if (rowData && !_.isEmpty(rowData)) {
    Object.assign(form, rowData);
    if (form.id) {
        let lastIndex = rowData.imageUrl.lastIndexOf('.');
        let extension = rowData.imageUrl.substring(lastIndex + 1);
        form.imgList = [{
          'fileUrl': rowData.imageUrl,
          'fileName': rowData.imageUrl,
          'fileType': extension,
          "url": rowData.imageUrl,
        }]
        form.bannerList = []
        for(var i=0;i<rowData.banners.length;i++){
            let bannerIdx = rowData.banners[i].lastIndexOf('.');
            let imgType = rowData.banners[i].substring(bannerIdx + 1);
            form.bannerList.push({
              'fileUrl': rowData.banners[i],
              'fileName': rowData.banners[i],
              'fileType': imgType,
              "url": rowData.banners[i],
            })
        }
      }  
  }
  // 使用字典时把下面这注释修改成自己的字典字段 有多个字典字段就复制多份同理修改 不然打开表单时不显示字典初始值
  // if (form.status && form.status.length > 0) {
  //   form.status = form.status.map((e) => e.valueCode);
  // }
  visibleFlag.value = true;
  nextTick(() => {
    formRef.value.clearValidate();
  });
}

function onClose() {
  Object.assign(form, formDefault);
  visibleFlag.value = false;
}

// ------------------------ 表单 ------------------------

// 组件ref
const formRef = ref();

const formDefault = {
  model: undefined, //型号
  type: BOX_TYPE_ENUM.SINGLE.value, //类型
  combination: undefined, //组合
  ton: undefined, //冷吨量
  tonCombination: undefined, //冷吨量组合
  imageUrl: undefined, //图片
  size: undefined, //尺寸
  scop: undefined, //必站SCOP，单位KW/KW
  drawings3dUrl: undefined, //3d图纸
  cadUrl: undefined, //CAD图纸
  stressAnalysisUrl1: undefined, //吊装应力分析
  stressAnalysisUrl2: undefined, //静应力分析
  totalPower: undefined, //总功率，单位KW
  chillerType: undefined, //制冷主机:类型
  chillerCoolingCapacityKw: undefined, //制冷主机:制冷量:KW
  chillerCoolingCapacityRt: undefined, //制冷主机:制冷量:RT
  chillerPower: undefined, //制冷主机:输入功率:KW
  chilledWaterPumpFlow: undefined, //冷冻水泵:流量:m³/h
  chilledWaterPumpHead: undefined, //冷冻水泵:扬程:m
  chilledWaterPumpPower: undefined, //冷冻水泵:功率:KW
  coolingWaterPumpFlow: undefined, //冷却水泵:流量:m³/h
  coolingWaterPumpHead: undefined, //冷却水泵:扬程:m
  coolingWaterPumpPower: undefined, //冷却水泵:功率:KW
  coolingTowerType: undefined, //冷却塔:类型
  coolingTowerFlow: undefined, //冷却塔:流量:m³/h
  coolingTowerPower: undefined, //冷却塔:功率:KW
  nozzleSize: undefined, //接管尺寸:进出水接管:DN
  scopSizeL: undefined, //必站外形尺寸:L
  scopSizeW: undefined, //必站外形尺寸:W
  scopSizeH: undefined, //必站外形尺寸:H
  liftingWeight: undefined, //必站重量:吊装重量:KG
  operatingWeight: undefined, //必站重量:运行重量:KG
  imgList: [],//显示的封面图
  banners: [],//表单的轮播图
  bannerList: [],//显示的轮播图
};

let form = reactive({...formDefault});

const rules = {
  model: [{required: true, message: '型号 必填'}],
  type: [{required: true, message: '类型 必填'}],
  imageUrl: [{required: true, message: '封面图 必填'}],
  banners: [{required: true, message: '轮播图 必填'}],
  size: [{required: true, message: '尺寸 必填'}],
  combination: [{required: true, message: '组合 必填'}],
  ton: [{required: true, message: '冷吨量 必填'}],
  tonCombination: [{required: true, message: '冷吨量组合 必填'}],
  scop: [{required: true, message: '必站SCOP，单位KW/KW 必填'}],
  drawings3dUrl: [{required: true, message: '必站3d图纸 必填'}],
  cadUrl: [{required: true, message: '必站CAD图纸 必填'}],
  stressAnalysisUrl1: [{required: true, message: '必站吊装应力分析 必填'}],
  stressAnalysisUrl2: [{required: true, message: '必站静应力分析 必填'}],
  totalPower: [{required: true, message: '总功率，单位KW 必填'}],
  chillerType: [{required: true, message: '制冷主机:类型 必填'}],
  chillerCoolingCapacityKw: [{required: true, message: '制冷主机:制冷量:KW 必填'}],
  chillerCoolingCapacityRt: [{required: true, message: '制冷主机:制冷量:RT 必填'}],
  chillerPower: [{required: true, message: '制冷主机:输入功率:KW 必填'}],
  chilledWaterPumpFlow: [{required: true, message: '冷冻水泵:流量:m³/h 必填'}],
  chilledWaterPumpHead: [{required: true, message: '冷冻水泵:扬程:m 必填'}],
  chilledWaterPumpPower: [{required: true, message: '冷冻水泵:功率:KW 必填'}],
  coolingWaterPumpFlow: [{required: true, message: '冷却水泵:流量:m³/h 必填'}],
  coolingWaterPumpHead: [{required: true, message: '冷却水泵:扬程:m 必填'}],
  coolingWaterPumpPower: [{required: true, message: '冷却水泵:功率:KW 必填'}],
  coolingTowerType: [{required: true, message: '冷却塔:类型 必填'}],
  coolingTowerFlow: [{required: true, message: '冷却塔:流量:m³/h 必填'}],
  coolingTowerPower: [{required: true, message: '冷却塔:功率:KW 必填'}],
  nozzleSize: [{required: true, message: '接管尺寸:进出水接管:DN 必填'}],
  scopSizeL: [{required: true, message: '必站外形尺寸:L 必填'}],
  scopSizeW: [{required: true, message: '必站外形尺寸:W 必填'}],
  scopSizeH: [{required: true, message: '必站外形尺寸:H 必填'}],
  liftingWeight: [{required: true, message: '必站重量:吊装重量:KG 必填'}],
  operatingWeight: [{required: true, message: '必站重量:运行重量:KG 必填'}],
};

// 点击确定，验证表单
async function onSubmit() {
  try {
    await formRef.value.validateFields();
    save();
  } catch (err) {
    message.error('参数验证错误，请仔细填写表单数据!');
  }
}

// 新建、编辑API
async function save() {
  SmartLoading.show();
  try {
    if (form.id) {
      await boApi.update(form);
    } else {
      await boApi.add(form);
    }
    message.success('操作成功');
    emits('reloadList');
    onClose();
  } catch (err) {
    smartSentry.captureError(err);
  } finally {
    SmartLoading.hide();
  }
}

function getImg(val){
    if(val.length>0){
      form.imageUrl =  val[0].fileUrl
      nextTick(() => {
        formRef.value.clearValidate();
      });
    }else{
      form.imageUrl =  ""
    }
   
  }

  function getBanner(val){
    if(val.length>0){
      form.banners =  val.map(item => item.fileUrl)
      nextTick(() => {
        formRef.value.clearValidate();
      });
    }else{
      form.banners =  []
    }
    console.log(form.banners)
  }

defineExpose({
  show,
});
</script>
